<template>
	<view class="page">
		<!-- 头部背景 -->
		<view class="head-bg">
			<view class="wallet-balance">
				<view class="wallet">
					<text class="number">￥{{type==1?dataInfo.balance1:type==5?dataInfo.balance5:dataInfo.balance3||0}}</text>
					<text><text class="iconfont icon-qianbao" style="margin-right: 20rpx;"></text>当前{{type==1?'余额':type==5?'冻结余额':'红包'}}</text>
					<view class="tixian" @click="go_url('/pages/tixian/tixian')" v-if="type==1">提现</view>
					<view class="tixian" @click="go_url('/pages/tixian/choongzhi')" v-if="type==3">充值</view>
				</view>
			</view>
			<view class="bg">
				<image src="/static/integral_bg1.png" mode=""></image>
			</view>
		</view>
		<view class="" style="height: 300rpx;"></view>
		<!-- 记录列表 -->
		<view class="flex flex-align fDang flex-bt" v-if="type==3">
			<view class="flex flex-align flex-line ">
				<view :class="tabIndex==1?'active':''" @click="tabs(1)" style="width: 150rpx;text-align: center;">历史记录</view>
				<view :class="tabIndex==2?'active':''" @click="tabs(2)" style="width: 150rpx;text-align: center;">今日发放</view>
			</view>
			<view class="right flex flex-align">
				<input type="text" placeholder="请输入ID/手机号" v-model="search" />
				<view class="" @click="searchList">搜索</view>
			</view>
		</view>
		<view class="" style="height: 100rpx;" v-if="type==3"></view>
		<view class="record-list">
			<view class="list" v-for="(item,index) in dataList" :key="index" v-if="dataList.length!=0">
				<view class="title-date">
					<view class="title">
						<text>{{item.content}}</text>
					</view>
					<view class="date">
						<text>{{item.created_at}}</text>
					</view>
				</view>
				<view class="integral">
					<text>{{item.price}}</text>
				</view>
			</view>
			<view class="empty-box" v-if="dataList.length==0">
				<image src="/static/ic_nodata.png" mode=""></image>
				<view class="">暂无数据</view>
			</view>
		</view>
		<view class="" style="height: 100rpx;" v-if="type==3"></view>
		<view class="footFix flex flex-align" v-if="type==3">
			<view class="flex-1">总充值金额：<text style="color: #f20;">{{Info.sum_recharge}}</text> </view>
			<view class="flex-1">已发放金额：<text style="color: #f20;">{{Info.sum}}</text> </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList:[],
				dataInfo:'',
				page:1,
				type:'',
				tabIndex:1,
				search:'',
				Info:''
			};
			
		},
		onLoad(e) {
			this.type=e.type
			uni.setNavigationBarTitle({
				title: e.type==1?'余额':e.type==5?'冻结余额':'红包'
			})
		},
		onShow() {
			let that = this
			that.getInfo()
			that.page=1
			that.dataList=[]
			that.getList()
		},
		onReachBottom() {
			let that = this
			that.page++
			that.getList()
		},
		methods:{
			tabs(e){
				this.tabIndex = e
				this.page=1
				this.dataList = []
				this.getList()
			},
			searchList(){
				this.page=1
				this.dataList = []
				this.getList()
			},
			getList(){
				let that = this
				if(that.type==1||that.type==5){
					that.tui.request("api.auth.center/balanceList", "POST", {page:that.page,type:that.type}, false, false, true).then((res) => {
						if(res.code==1){
							that.dataList = that.dataList.concat(res.data.list)
						}
					}).catch((res) => {
						
					})
				}else if(that.type==3){
					that.tui.request("api.auth.center/balance3List", "POST", {page:that.page,time:that.tabIndex,keyword:that.search}, false, false, true).then((res) => {
						if(res.code==1){
							that.dataList = that.dataList.concat(res.data.list)
							that.Info = res.data
						}
					}).catch((res) => {
						
					})
				}
				
			},
			getInfo(){
				let that = this
				that.tui.request("api.auth.center/get", "POST", {}, false, false, true).then((res) => {
					if(res.code==1){
						that.dataInfo = res.data
					}
				}).catch((res) => {
					
				})
			},
			go_url(e){
				this.tui.href(e)
			},
		}
	}
</script>

<style scoped lang="scss">
	@import 'ConsumeRecord.scss';
	.fDang{padding-top: 10rpx;border-bottom: 1px solid #eee;position: fixed;top:300rpx;left: 0;width: 100%;background: #fff;padding-bottom: 10rpx;
		view{line-height: 80rpx;}
		.active{position: relative;}
		.active::after{position: absolute;bottom: 10rpx;left: 50%;width: 80rpx;height: 4rpx;background: $base;margin-left: -40rpx;content:'';}
		.right{margin-right: 10rpx;background: #f3f3f3;padding: 0 20rpx;border-radius: 6rpx;}
	}
	.footFix{position: fixed;bottom: 0;left: 0;width: 100%;background: #fff;text-align: center;padding-bottom: 0rpx;
		.flex-1{line-height:80rpx;}
	}
</style>
